<template>
  <div class="app-container">
    <el-input v-model="filterText" placeholder="请输入关键字" style="margin-bottom:30px;" />

    <el-tree
      ref="tree2"
      :data="subjectList"
      :props="defaultProps"
      :filter-node-method="filterNode"
      class="filter-tree"
      default-expand-all
    />
  </div>
</template>

<script>
    import subject from '@/api/edu/subject';
    export default {
        name: "list",
      data() {
        return {
          filterText: "",
          subjectList: [],
          defaultProps: {
            children: "children",
            label: "title"
          }
        };
      },
      created() {
        this.getSubjectList();
      },
      watch: {
        filterText(val) {
          this.$refs.tree2.filter(val);
        }
      },

      methods: {
        getSubjectList() {
          subject.getAllSubjectList()
            .then(res => {
              this.subjectList = res.data.items
            })
        },

        filterNode(value, data) {
          if (!value) return true;
          return data.title.toLowerCase().indexOf(value.toLowerCase()) !== -1;
        }
      }
    }
</script>

<style scoped>

</style>
